<!DOCTYPE html>
<html>
<head>
	<title>登录</title>
	<meta charset="utf-8">
	<script type="text/javascript">
	!function(a){function b(){var b=g.getBoundingClientRect().width;a.rem=(b/6.4>100?100:(b/6.4<50?50:b/6.4)),g.style.fontSize=a.rem+"px"}var g=a.document.documentElement,e;a.addEventListener("resize",function(){clearTimeout(e),e=setTimeout(b,300)},!1),a.addEventListener("pageshow",function(a){a.persisted&&(clearTimeout(e),e=setTimeout(b,300))},!1),b()}(window);
	</script>
	<link rel="stylesheet" type="text/css" href="./css/css_reset.css" />
	<link rel="stylesheet" type="text/css" href="css.css" />
	<style type="text/css">
		body{background-color: #f5f6f7;}
		.wrapper{width: 12.6rem; margin: 0 auto; }
		/*登录*/
		.login-container{width: 50%;color: #e5e5e5;padding-top: 80px;padding-bottom: 100px;margin: 0 auto;font-family: '方正兰亭黑','微软雅黑','黑体',sans-serif;}
		.login-container .input,.login-container .button {width: 70%;height: 50px;margin:30px auto;display: block;text-align: center;}
		.login-container .input{background-color: #fff;line-height: 50px;border-radius: 5px;border: 1px solid #e1e1e1;padding-left: 15px;}
		.login-container  label{display: inline-block;width:63px;height: 14px;font-size: 20px;color: #595757;float: left; }
		.login-container  input{width: 70%;height: 50px;border: none;outline: none;font-size: 18px;}
		.login-container .button button{width: 100%;line-height: 50px;border-radius: 5px;font-size: 20px;color: #797b7e;background-color: #1f242b;box-shadow:-webkit-box-shadow:1px 1px 1px black; box-shadow:1px 1px 1px black;border: none;outline: none;}
	</style>
</head>
<body>
	<div class="wrapper">
		<iframe src="./common/head.html" frameborder="0" width="1260px" height="80px" scrolling="no" name="frame1" ></iframe>
		<div class="login">
			<div class="login-container">
				<div class="input">
					<label for="username">用户名</label>
					<input id="username" name="username" placeholder="如.xiaoming"></div>
				<div class="input">
					<label for="password">密码</label>
					<input id="password" name="password" type="password" placeholder="密码至少在6位以上"></div>
				<!-- <div class="input">
					<label for="auth_code">验证码：</label>
					<input id="auth_code" type="code" name="code" size="10" style="height:23px" />
 					<img src="./handler/imgcode.php">	
 				</div> -->
				<div class="button" id="button">
					<button id = "login-button">登录</button>
				</div>
			</div>
		</div>
		<span id="backdata"></span>
		<iframe src="./common/foot.html" frameborder="0" width="1260px" height="370px" scrolling="no" name="frame2" ></iframe>
	</div>
	<script type="text/javascript" charset="utf-8" src="./js/jquery-1.11.3.min.js"></script>
	<script type="text/javascript" charset="utf-8">
	$(function() {  
		$("#button").click(function() {  
			// var params = $("input").serialize();  
			var jsonData = {
				"username" : $("#username").val(),
				"password" : $("#password").val(),
				// "code" : $("#auth_code").val()
			}
			// var url = "handle.php";  
			 var url = "./handler/login.php";  
			$.ajax({  
				type: "post",  
				url: url,  
				dataType: "json",  
				data: jsonData,  
				success: function(msg){  
							if(msg.isLoginSuccess){
								location.href = "./index.html";
							}else{
								alert("登录失败，请重新登录")
							}
					 
						}  
			});  
		}); 
	});    
</script>
</body>
</html>